<div class="ig-row" data-id="{{id}}" id="conf_{{id}}">
  <div class="ig-row__layout">
    <div class="ig-info">
      {{#if recording}}
        <a class="ig-title element_toggler"
            href="#"
            aria-controls="conference-{{id}}"
            aria-expanded="false"
            role="button">
          {{> icons/mini-arrow-right}}
          {{title}}
        </a>
      {{else}}
        <span class="ig-title">{{title}}</span>
      {{/if}}
      <span class="{{#if has_actions}}has_actions{{/if}}">
        {{#if started_at}}
          <span class="label label-success ig-row-label">{{#t "in_progress"}}In Progress{{/t}}</span>
        {{/if}}
      </span>
      <div class="ig-details">
        {{#if scheduled}}
          <div>{{datetimeFormatted scheduled_at}}</div>
        {{/if}}
        {{#if recording}}
          {{#if multipleRecordings}}
            <div>{{#t "recordings"}}{{recordingCount}} Recordings{{/t}}</div>
          {{else}}
            <div>{{#t "recording"}}1 Recording{{/t}}</div>
          {{/if}}
        {{/if}}
        <div>{{description}}</div>
      </div>
    </div>
    <div class="ig-admin">
      {{# if show_end}}
        <a class='btn btn-small close_conference_link' href="{{ url }}/close">{{#t "end_it_now"}}End{{/t}}</a>
      {{/if}}
      {{#if started_at}}
        {{#if permissions.join}}
          <a href="{{ join_url }}" class="btn btn-small join-button btn-primary" target="_blank">
            {{#t "join"}}Join{{/t}}
          </a>
        {{/if}}
      {{else}}
        {{#if permissions.initiate}}
          <a href="{{ join_url }}" class="btn btn-small start-button" target="_blank" {{#unless id}}disabled="disabled"{{/unless}}>
            {{#t "start"}}Start{{/t}}
         </a>
        {{/if}}
      {{/if}}
      {{#if has_actions}}
        <div class="inline-block">
          <a class="al-trigger al-trigger-gray {{#unless id}}ui-state-disabled{{/unless}}" role="button" aria-haspopup="true"
           aria-owns="{{id}}-content-1" href="#">
            {{> icons/settings}}
            {{> icons/mini-arrow-down}}
            <span class="screenreader-only">{{#t "settings"}}Settings{{/t}}</span>
          </a>
          <ul id="{{id}}-content-1" class="al-options" role="menu" aria-hidden="true" aria-expanded="false" aria-activedescendant="{{id}}-content-2">
            {{#if permissions.update}}
              <li role="presentation">
                <a href="#conference_{{ id }}"
                    class="icon-edit edit_conference_link"
                    id="{{id}}-content-2"
                    role="menuitem"
                    title="{{#t "edit"}}Edit{{/t}}">{{#t "edit"}}Edit{{/t}}</a>
              </li>
            {{/if}}
            {{#if permissions.delete}}
              <li role="presentation">
                <a href="{{ url }}"
                    class="icon-trash  delete_conference_link"
                    id="{{id}}-content-3"
                    role="menuitem"
                    aria-label="{{#t "delete"}}Delete{{/t}}"
                    title="{{#t "delete"}}Delete{{/t}}">{{#t "delete"}}Delete{{/t}}
                </a>
              </li>
            {{/if}}
          </ul>
        </div>
      {{/if}}
    </div>
  </div>
</div>
{{#if recording}}
  <div class="ig-sublist" id="conference-{{id}}" style="display: none;">
    <ul>
      {{#each recordings}}
        <li>
          <div class="ig-row">
            <div class="ig-row__layout">
              <div class="ig-info">
                <div class="ig-details">
                  <a href="{{playback_url}}" target="_blank" class="ig-title">
                    {{title}}
                  </a>
                  {{dateString created_at}}
                  &nbsp;&#124;&nbsp;
                  {{minutesToHM duration_minutes}}
                </div>
              </div>
              <div class="ig-button">
                <a class="btn btn-small" target="_blank" href="{{playback_url}}">
                  {{#t "view"}}View{{/t}}
                </a>
              </div>
            </div>
          </div>
        </li>
      {{/each}}
    </ul
  </div>
{{/if}}
